<template>
  <!-- 看懂下边的代码 -->
  <!-- <h2 a="1+1" :b="1+1" c="x" :d="x" ref="qwe"></h2> -->
  <!-- 限制了后就必须对应personList的类型 -->
  <Person :list="personList" />
</template>

<script setup lang="ts">
import { reactive } from "vue";
import Person from "./components/Person.vue";
import { type Persons } from "./types";

let x = 9;

// 可以在reactive后面添加<泛型> 去限制字段
let personList = reactive<Persons>([
  { id: "asdfga", name: "张三", age: 60 },
  { id: "cdsada", name: "李四", age: 18 },
  { id: "dssdsd", name: "王五", age: 8 },
]);
// console.log(personList);
</script>

<style></style>
